<template>
	<view class="login-container">
		<view class="login-title">
			<u--image :src="logo" width="160rpx" height="160rpx" mode="widthFix"></u--image>
		</view>
		<view class="login-content">
			<u--form :model="loginForm" labelWidth="80" :rules="rules" ref="uForm">
				<u-form-item label="账号" prop="account" borderBottom>
					<u-input clearable v-model="loginForm.account" placeholder="请输入账号" type="text" border="none" maxlength="11"></u-input>
				</u-form-item>
				<u-form-item borderBottom prop="password">
					<view slot="label" class="label-box">密码</view>
					<view class="flex-box">
						<view>
							<u-input
								:password="isPassword"
								ref="passwordInput"
								password-eye
								type="text"
								clearable
								v-model="loginForm.password"
								placeholder="请输入密码"
								@click="togglePassword"
							></u-input>
						</view>
						<view class="sunui-password-box">
							<sunui-password @change="showPass" />
						</view>
					</view>
				</u-form-item>
			</u--form>
			<view class="btn-box">
				<u-button :loading="isLoading" :disabled="isLoading"  shape="circle" color="#409eff" type="primary" @click="handleLoGin">登录</u-button>
			</view>
		</view>
			
	</view>
</template>

<script>
import { login } from '@/api/login/login.js';
export default {
	data() {
		return {
			logo: 'https://lfn.oss-cn-shanghai.aliyuncs.com/webimage/logo.png',
			loginForm: {
				account: '',
				password: ''
			},
			isPassword: true,
			rules: {
				account: [
					{ required: true, message: '请输入账号', trigger: 'blur' }
					// { validator: this.checkPhoneNum, trigger: 'blur' }
				],
				password: [{ required: true, message: '请输入密码', trigger: 'blur' }]
			},
			isLoading:false,
		
		};
	},
	onReady() {
		//onReady 为uni-app支持的生命周期之一
		this.$refs.uForm.setRules(this.rules);
	},
	methods: {
		// 睁眼闭眼
		showPass(e) {
			this.isPassword = e;
		},
		handleLoGin() {
			this.$refs.uForm
				.validate()
				.then((res) => {
					console.log(3423);
					let params = {
						...this.loginForm
					};
					this.isLoading=true
					login(params).then((res) => {
						console.log(res);
						if (res.code == 1) {
							this.isLoading=false
							let userData = res.data;
							let token =userData.token;
							uni.setStorageSync('userData',userData)
							uni.setStorageSync('token',token)
							setTimeout(()=>{
								uni.switchTab({
									url: '/pages/main/main'
								});
							},1000)
							
						} else {
							this.isLoading=false
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 3000
							});
						}
					});
				})
				.catch((errors) => {});
		}
	}
};
</script>

<style lang="scss" scoped>
.login-container {
	height: 100vh;
	background: #f6f9fe;
	position: fixed;
	padding-top: 200rpx;
	box-sizing: border-box;
	width: 100%;
}
.login-title {
	display: flex;
	justify-content: center;
	align-items: center;
}
.login-content {
	padding: 80rpx 50rpx 0;
}
.flex-box {
	display: flex;
}
.label-box {
	margin: 15rpx 80rpx 0 0;
}
.sunui-password-box {
	display: flex;
	justify-content: center;
	align-items: center;
}
.btn-box {
	margin-top: 50rpx;
}
</style>
